<!--查询指定气体-->
<!DOCTYPE>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>查询指定气体</title>
    <link rel="stylesheet" href="../lib/layui-v2.6.3/css/layui.css">
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>查询指定气体</legend>
</fieldset>
<!--面板-->
<div class="layui-card">
    <div class="layui-card-body">
        <label class="layui-form-label">气体名称</label>
        <div class="layui-input-inline">
            <input type="text" id="gasName" class="layui-input">
        </div>
        <button onclick="search();" class="layui-btn"><i class="layui-icon">&#xe615;</i></button>
    </div>
</div>

<div style="padding: 20px;">
    <!--面板-->
    <div class="layui-col-md12">
        <div class="layui-card">
            <div class="layui-card-header" style="font-size: large ">气体信息</div>
            <div class="layui-card-body" id="gas"></div>
        </div>
    </div>
</div>

<script src="../lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>
<script src="../lib/layui-v2.6.3/layui.js"></script>
<script>
    //搜索
    function search(){
        //气体名称
        var gasName=$("#gasName").val();
        $.ajax({
            url:"/record/" + gasName,
            type:"GET",
            dataType:"JSON",
            success:function (gas){
                if(gas == null || gas == undefined || gas == ""){
                    layer.msg("该气体不存在");
                    return;
                }
                //处理用户信息
                $("#gas").append("气体编号:"+ gas["gasId"]+"<br/>")
                    .append("气体名称:"+ gas["gasName"]+"<br/>")
                    .append("气体含量:"+ gas["gasContent"]+"<br/>")
                    .append("气体危险等级:"+ gas["harm"]+"<br/>")
                    .append("特性:"+ gas["features"]+"<br/>")
                    .append("来源:"+ gas["source"]+"<br/>")
                    .append("应急措施:"+ gas["measure"]+"<br/>")
                    .append("上一次修改时间:"+ gas["updateTime"]);
            },
        });
    }
</script>
</body>
</html>